<template>
  <div class="knowledge-detail-page flex-col">
    <navbar :back="isBack" @goBack="goBack"/>

    <scroll-view class="knowledge-detail-container flex-1" scroll-y>
      <div class="clear-10"></div>
      <div class="article-box flex-col">
        <div class="title">{{postDetail.title}}</div>
        <div class="author">
          {{postDetail.name}}
        </div>

        <div class="content-box">
          <rich-text :nodes="postDetail.content"></rich-text>
        </div>
      </div>
    </scroll-view>
  </div>
</template>

<script>
  import navbar from '@/components/navbar'
  import global from 'global'
  import Core from 'core'
  import Common from 'common'

  export default {
    components: {
      navbar
    },
    data () {
      return {
        statusH: global.state.statusH,
        titleH: global.state.titleH,
        navBarHeight: global.state.statusH + global.state.titleH,
        isBack: true,
        postDetail: {}
      }
    },

    methods: {
      goBack () {
        Core.Util.goBack()
      },

      _getPostDetail () {
        let id = this.$root.$mp.query['post_id']
        if (id) {
          Core.Api.Post.postDetail(id).then(res => {
            this.postDetail = res.post
            this.postDetail['process_create_time'] = Core.Util.timeFormat(this.postDetail.create_time, 'm-d')
          })
        }
      }
    },

    onLoad () {
    },

    onShow () {
      this._getPostDetail()
    }
  }
</script>

<style lang="scss" scoped>
  .knowledge-detail-page {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #ffffff;

    .knowledge-detail-container {
      height: 100%;
      overflow-y: auto;
      .clear-10 {
        background-color: rgb(243, 242, 243);
      }

      .article-box {
        padding: 20px 12px;

        .title {
          font-size: 19px;
          color: #313131;
          line-height: 20px;
        }

        .author {
          margin-top: 16px;
          color: #0EC5A9;
          font-size: 13px;
        }

        .content-box {
          font-size: 14px;
          color: #313131;
          margin-top: 24px;
          line-height: 24px;
        }
      }
    }
  }
</style>
